import * as THREE from "three";
// 引入Three.js扩展库
import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
// 引入CSS2渲染器CSS2DRenderer和CSS2模型对象CSS2DObject
import { CSS3DRenderer } from 'three/addons/renderers/CSS3DRenderer.js';
import { CSS2DRenderer } from 'three/addons/renderers/CSS2DRenderer.js';

import {model} from './scene/mesh.js'
var width = window.innerWidth;
var height = window.innerHeight;
var k = width / height; //窗口宽高比
// var s = 200;
var s = 90;//根据包围盒大小(行政区域经纬度分布范围大小)设置渲染范围
//创建相机对象
var camera = new THREE.OrthographicCamera(-s * k, s * k, s, -s, 1, 1000);
const box = new THREE.Box3();
box.expandByObject(model) 
const scaleV3 = new THREE.Vector3()
box.getCenter(scaleV3)
console.log('104, 35',scaleV3);
// camera.position.set(116.469, 40.252, 200); //沿着z轴观察
//     camera.lookAt(116.469, 40.252, 0); //指向中国地图的几何中心
camera.position.set(0, -200, 200); //沿着z轴观察
camera.lookAt(0, 0, 0); //指向中国地图的几何中心
// camera.position.set(0, 20, 200);
// camera.lookAt(0, 20, 0);//指向中国地图的几何中心
// 创建renderer
/**
 * 创建渲染器对象
 */
var renderer = new THREE.WebGLRenderer({
    antialias: true, //开启锯齿
});
const css3Renderer = new CSS3DRenderer();
const css2Renderer = new CSS2DRenderer();
// renderer.outputEncoding = THREE.sRGBEncoding;
renderer.setPixelRatio(window.devicePixelRatio);//设置设备像素比率,防止Canvas画布输出模糊。
renderer.setSize(width, height); //设置渲染区域尺寸
css3Renderer.setSize(width, height);
// //设置.pointerEvents=none，以免模型标签HTML元素遮挡鼠标选择场景模型
css3Renderer.domElement.style.pointerEvents = 'none';
css3Renderer.domElement.style.position = 'absolute';
css3Renderer.domElement.style.top = '0px';
css3Renderer.domElement.style.left = '0px';

css2Renderer.setSize(width, height);
// //设置.pointerEvents=none，以免模型标签HTML元素遮挡鼠标选择场景模型
css2Renderer.domElement.style.pointerEvents = 'none';
css2Renderer.domElement.style.position = 'absolute';
css2Renderer.domElement.style.top = '0px';
css2Renderer.domElement.style.left = '0px';
const controls = new OrbitControls(camera, renderer.domElement);
controls.target.set(0, 20, 0);
controls.update();
// // 左右旋转限制100度
// controls.maxAzimuthAngle = Math.PI * (100/180);
// controls.minAzimuthAngle = -Math.PI * (100/180);
// // 上下旋转限制100度
// controls.maxPolarAngle = Math.PI * (120/180);
// controls.minPolarAngle =  Math.PI * (30/180);
// // 缩放限制
// controls.maxDistance = 500;
// controls.minDistance = 200;

export {camera,renderer,css3Renderer,css2Renderer};